<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>小例子</title>
    <style type="text/css">
        ul{ width: 360px; height: 360px;}
        li{width:100px; height:100px; border: 10px solid #f40; float: left; list-style: none; margin-left: -10px; margin-top: -10px; position: relative; }
        li:hover{ border:10px solid #000; z-index: 10;}
    </style>
</head>
<body>
    <ul>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
    </ul>
</body>
</html>